﻿<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>API文档发布</title>
    <div th:replace="include/_meta :: head"></div>
</head>
<body>


<section class="Hui-article-box">
    <div class="Hui-article">
        <div class="container-fluid">
            <div class="row cl">
                <div class="col-xs-12 col-sm-12 text-c">
                    <button class="btn btn-default" onclick="switchModel(1);modelData(1);">项目</button>
                    &nbsp;&nbsp;&nbsp;
                    <button class="btn btn-default" onclick="switchModel(2);modelData(2);">项目模块</button>
                    &nbsp;&nbsp;&nbsp;
                    <button class="btn btn-default" onclick="window.location=ctx">前台预览</button>
                    &nbsp;&nbsp;&nbsp;
                    <button class="btn btn-default" onclick="window.location=ctx+'/tree/data'">发布API</button>
                </div>
            </div>
        </div>
        <div class="page-container" id="one">
            <div class="cl pd-5 bg-1 bk-gray mt-20">
                <span class="l">
                    <form class="form-inline">
                        <div class="form-group">
                            <input type="text" name="name" id="input_1" class="input-text radius size-M" placeholder="项目名称"/>
                            <input type="hidden" class="input-text radius size-M" />
                        </div>
                        <div class="form-group">
                            <a class="btn btn-success radius" onclick="add_1($('#input_1').next().val(),$('#input_1').val())" href="javascript:;">
                                提交
                            </a>
                        </div>
                    </form>
                </span>
            </div>
            <div class="mt-20">
                <table class="table table-border table-bordered table-bg table-hover">
                    <thead>
                    <tr class="text-c">
                        <th width="80">项目名称</th>
                        <th width="80">显示状态</th>
                        <th width="50">创建时间</th>
                        <th width="80">相关操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr class="text-c" th:each="data : ${firstLevelList}">
                        <td th:text="${data.name}"></td>
                        <td>
                            <span style="cursor: pointer" th:onclick="'changeStatus(\'' + ${data.id} + '\');'" class="badge badge-success radius" th:if="${data.showFlag == 1}">显示</span>
                            <span style="cursor: pointer" th:onclick="'changeStatus(\'' + ${data.id} + '\');'" class="badge badge-danger radius" th:if="${data.showFlag == 0}">不显示</span>
                        </td>
                        <td th:text="${#dates.format(data.createTime, 'yyyy-MM-dd HH:mm:ss')}"></td>
                        <td>
                            <a href="javascript:;"  th:onclick="'update_1(\'' + ${data.id} + '\',\'' + ${data.name} + '\');'" class="btn btn-warning radius">修改</a>
                            <a href="javascript:;"  th:onclick="'del_1(\'' + ${data.id} + '\');'" class="btn btn-danger radius">删除</a>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div style="display: none" class="page-container" id="two">
            <div class="cl pd-5 bg-1 bk-gray mt-20">
                <span class="l">
                    <form class="form-inline">
                        <div class="form-group">
                            <input type="text" name="name" id="input_2" class="input-text radius size-M" placeholder="模块名称"/>
                            <input type="hidden" class="input-text radius size-M" />
                        </div>
                        <label>所属项目：</label>
                        <div class="form-group">
                            <span class="select-box">
                              <select class="select radius size-M" size="1" id="demo1">
                                  <option th:selected="${data.id == parentId}" th:value="${data.id}" th:text="${data.name}"  th:each="data : ${firstLevelList}"></option>
                              </select>
                            </span>
                        </div>
                        <div class="form-group">
                            <a onclick="add_2($('#input_2').next().val(),$('#input_2').val())" class="btn btn-success radius" href="javascript:;">
                                提交
                            </a>
                        </div>
                        <div class="form-group">
                            <span class="select-box">
                              <select class="select radius size-M" size="1" id="demo2">
                                  <option th:selected="${data.id == parentId}" th:value="${data.id}" th:text="${data.name}"  th:each="data : ${firstLevelList}"></option>
                              </select>
                            </span>
                        </div>
                        <div class="form-group">
                            <a class="btn btn-success radius" onclick="toQuery();" href="javascript:;">
                                查询
                            </a>
                        </div>
                    </form>
                </span>
                <span class="r">
                    <a class="btn btn-success radius" onclick="window.location=ctx" href="javascript:;">
                        返回前台
                    </a>
                </span>
            </div>
            <div class="mt-20">
                <table class="table table-border table-bordered table-bg table-hover">
                    <thead>
                    <tr class="text-c">
                        <th width="80">模块名称</th>
                        <th width="80">所属项目</th>
                        <th width="50">创建时间</th>
                        <th width="80">相关操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr class="text-c" th:each="data : ${secondLevelList}">
                        <td th:text="${data.name}"></td>
                        <td th:text="${parentName}"></td>
                        <td th:text="${#dates.format(data.createTime, 'yyyy-MM-dd HH:mm:ss')}"></td>
                        <td>
                            <a href="javascript:;"  th:onclick="'update_2(\'' + ${data.id} + '\',\'' + ${data.name} + '\');'" class="btn btn-warning radius">修改</a>
                            <a href="javascript:;"  th:onclick="'del_2(\'' + ${data.id} + '\');'" class="btn btn-danger radius">删除</a>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <footer class="footer">
            <p>
                感谢jQuery、layer、laypage、Validform、UEditor、My97DatePicker、iconfont、Datatables、WebUploaded、icheck、highcharts、bootstrap-Switch<br/>
                Copyright &copy;2015 H-ui.admin v3.0 All Rights Reserved.<br/> 本后台系统由<a href="http://www.h-ui.net/"
                                                                                        target="_blank"
                                                                                        title="H-ui前端框架">H-ui前端框架</a>提供前端技术支持
            </p>
        </footer>
    </div>
</section>


<div th:replace="include/_footer :: footer"></div>

<script type="text/javascript" th:inline="javascript">
    $(function () {
        var flag = [[${switchModel}]];
        switchModel(flag);
    });

    function toQuery(){
        var parentId = $("#demo2").find("option:selected").val();
        modelData(2,parentId);
    }
    function changeStatus(id){
        $.ajax({
            type: "post",
            url: ctx+"/back/changeStatus",
            data: {id:id},
            dataType: "text",
            async : false, //同步请求
            success: function(data){
                location = location;
            },
            error:function(err){
                badMood("服务器异常，请稍后重试！");
            }
        });
    }

    function update_1(id,name){
        $("#input_1").val(name);
        $("#input_1").next().val(id);
    }

    function update_2(id,name){
        $("#input_2").val(name);
        $("#input_2").next().val(id);
    }

    function del_1(id){
        layer.confirm('确认删除？', {
            btn: ['确认','取消'] //按钮
        }, function(){
            $.ajax({
                type: "post",
                url: ctx+"/back/del",
                data: {id:id},
                dataType: "text",
                async : false, //同步请求
                success: function(data){
                    if (data=="true"){
                        location = location;
                    }else {
                        layer.alert(data);
                    }
                },
                error:function(err){
                    badMood("服务器异常，请稍后重试！");
                }
            });
        }, function(){
        });
    }


    function del_2(id){
        layer.confirm('确认删除？', {
            btn: ['确认','取消'] //按钮
        }, function(){
            $.ajax({
                type: "post",
                url: ctx+"/back/del2",
                data: {id:id},
                dataType: "text",
                async : false, //同步请求
                success: function(data){
                    if (data=="true"){
                        location = location;
                    }else {
                        layer.alert(data);
                    }
                },
                error:function(err){
                    badMood("服务器异常，请稍后重试！");
                }
            });
        }, function(){
        });
    }


    function add_1(id,name){
        if(!$.trim(name)){
            layer.alert("名称为空！");
            return;
        }
        if (id){
            $.ajax({
                type: "post",
                url: ctx+"/back/add",
                data: {id:id,name:name},
                dataType: "text",
                async : false, //同步请求
                success: function(data){
                    location = location;
                },
                error:function(err){
                    badMood("服务器异常，请稍后重试！");
                }
            });
        }else {
            $.ajax({
                type: "post",
                url: ctx+"/back/add",
                data: {name:name},
                dataType: "text",
                async : false, //同步请求
                success: function(data){
                    location = location;
                },
                error:function(err){
                    badMood("服务器异常，请稍后重试！");
                }
            });
        }

    }



    function add_2(id,name){
        if(!$.trim(name)){
            layer.alert("名称为空！");
            return;
        }
        var parentId = $("#demo1").val();
        if (id){
            $.ajax({
                type: "post",
                url: ctx+"/back/add",
                data: {id:id,name:name,parentId:parentId},
                dataType: "text",
                async : false, //同步请求
                success: function(data){
                    location = location;
                },
                error:function(err){
                    badMood("服务器异常，请稍后重试！");
                }
            });
        }else {
            $.ajax({
                type: "post",
                url: ctx+"/back/add",
                data: {name:name,parentId:parentId},
                dataType: "text",
                async : false, //同步请求
                success: function(data){
                    location = location;
                },
                error:function(err){
                    badMood("服务器异常，请稍后重试！");
                }
            });
        }

    }


</script>
</body>
</html>



















